<div class="layui-container fly-marginTop"> 
<div class="fly-panel fly-panel-user" pad20=""> 
<div class="layui-tab layui-tab-brief" lay-filter="user"> 
 <ul class="layui-tab-title"> 
  <li class="layui-this">登入</li> 
  <li><a href="/user/reg/">注册</a></li> 
 </ul> 
 <div class="layui-form layui-tab-content" id="LAY_ucm" style="padding: 20px 0;"> 
  <div class="layui-tab-item layui-show"> 
   <div class="layui-form layui-form-pane"> 
    <form method="post"> 
     <div class="layui-form-item"> 
      <label for="L_email" class="layui-form-label">手机/邮箱</label> 
      <div class="layui-input-inline"> 
       <input type="text" id="L_loginName" value="18925139194" name="loginName" required="" lay-verify="required" autocomplete="off" class="layui-input" /> 
      </div> 
      <div class="layui-form-mid layui-word-aux">
        使用手机或者邮箱中的任意一个均可（若采用手机，请确保你的帐号已绑定过该手机） 
      </div> 
     </div> 
     <div class="layui-form-item"> 
      <label for="L_pass" class="layui-form-label">密码</label> 
      <div class="layui-input-inline"> 
       <input type="password" id="L_pass" value="123456" name="password" required="" lay-verify="required" autocomplete="off" class="layui-input" /> 
      </div> 
     </div> 
     <!-- <div class="layui-form-item"> 
      <label for="L_vercode" class="layui-form-label">图形码</label> 
      <div class="layui-input-inline"> 
       <input type="text" id="L_imagecode" name="captcha" required="" lay-verify="required" autocomplete="off" class="layui-input" /> 
      </div> 
      <div class="layui-form-mid" style="padding: 0!important;"> 
      <img src="{:url('index/reg/code')}" class="fly-imagecode"  id="{:url('index/reg/code')}" onclick="this.src=this.id+'?t='+Math.random()" />
      </div> 
     </div> -->
     <style>
       .hide{
        display: none;
       }
     </style>
     <div class="layui-form-item">
        <div id="embed-captcha"></div>
        <p id="wait" class="show">正在加载验证码......</p>
        <p id="notice" class="hide">请先完成验证</p> 
     </div>
     <div class="layui-form-item"> 
      <button class="layui-btn" lay-filter="login" lay-submit="">立即登录</button> 
      <span style="padding-left:20px;"> <a href="/user/forget">忘记密码？</a> </span> 
     </div> 
     <div class="layui-form-item fly-form-app"> 
      <span>或者使用社交账号登入</span> 
      <a href="/app/qq" onclick="layer.msg('正在通过QQ登入', {icon:16, shade: 0.1, time:0})" class="iconfont icon-qq" title="QQ登入"></a> 
      <a href="/app/weibo/" onclick="layer.msg('正在通过微博登入', {icon:16, shade: 0.1, time:0})" class="iconfont icon-weibo" title="微博登入"></a> 
     </div> 
    </form> 
   </div> 
  </div> 
 </div> 
</div> 
</div>
</div>
<script src="__STATIC__/index/js/gt.js"></script>
<script>
    var handlerEmbed = function (captchaObj) {
        $("#embed-submit").click(function (e) {
            var validate = captchaObj.getValidate();
            if (!validate) {
                $("#notice")[0].className = "show";
                setTimeout(function () {
                    $("#notice")[0].className = "hide";
                }, 2000);
                e.preventDefault();
            }
        });
        // 将验证码加到id为captcha的元素里，同时会有三个input的值：geetest_challenge, geetest_validate, geetest_seccode
        captchaObj.appendTo("#embed-captcha");
        captchaObj.onReady(function () {
            $("#wait")[0].className = "hide";
        });
        // 更多接口参考：http://www.geetest.com/install/sections/idx-client-sdk.html
    };

    $.ajax({
        // 获取id，challenge，success（是否启用failback）
        url: "{:url('index/gt/ajax')}?t=" + (new Date()).getTime(), // 加随机数防止缓存
        type: "get",
        dataType: "json",
        success: function (data) {
            console.log(data);
            // 使用initGeetest接口
            // 参数1：配置参数
            // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它做appendTo之类的事件
            initGeetest({
                gt: data.gt,
                challenge: data.challenge,
                new_captcha: data.new_captcha,
                product: "embed", // 产品形式，包括：float，embed，popup。注意只对PC版验证码有效
                offline: !data.success // 表示用户后台检测极验服务器是否宕机，一般不需要关注
                // 更多配置参数请参见：http://www.geetest.com/install/sections/idx-client-sdk.html#config
            }, handlerEmbed);
        }
    });
</script>
  <script>
  //Demo
  layui.use('form', function(){
    var form = layui.form;

    //监听提交
    form.on('submit(login)', function(data){
      // layer.msg(JSON.stringify(data.field));
      $.post('{:url('index/login/checkLogin')}', data.field, function(data, textStatus, xhr) {
        console.log(data);
        if(data.code==1){
          layer.alert(data.msg, {icon: 6},function(){
            location.href="{:url('index/user/index')}";
          });
        }else{
          $('.fly-imagecode').click();
          layer.msg(data.msg, function(){
        //关闭后的操作
        });
        }
      });
      
      return false;
    });
  });
  </script>
  